<template>
  <!--深加工信息-->
<div style="margin-top: 15px;">
  <table style="width: 40%;">
    <thead></thead>
    <tbody>
      <tr>
        <td style="color:dodgerblue;font-size: 20px;">深加工信息
          &nbsp;&nbsp;&nbsp;&nbsp;
          <el-button type="info" @click="SetUp">设置</el-button>
        </td>
      </tr>

      <tr>
        <td>班组：{{ DeepProcessingData.teamsAndGroups }}</td>
        <td>负责人：{{ DeepProcessingData.personInCharge }}</td>
      </tr>

      <tr>
      <td style="color:dodgerblue;font-size: 20px;">食品安全信息</td>
    </tr>
      <span v-for="item in DeepProcessingPicture" :key="item.deepProcessingId"><img :src="item.pictureName" width="70px" height="70px" />&nbsp;&nbsp;&nbsp;</span>
      <el-button style="width: 100px;height: 100px;" @click="dialogFormVisible=true">+</el-button>
    </tbody>
  </table>
</div>

  <!--供应商信息-->
<div style="margin-top: 15px;">
  <table style="width: 20%;">
    <thead></thead>
    <tbody>
      <tr>
        <td style="color:dodgerblue;font-size: 20px;">供应商信息
        </td>
      </tr>

      <tr>
        <td style="font-weight: bold;">原料</td>
        <td>
          <el-button type="info" @click="SetUpRawMaterial">设置</el-button>
        </td>
      </tr>

      <tr>
        <td>生产批次：{{ RawMaterialData.rawMaterialProductionBatch }}</td>
      </tr>

      <tr>
        <td style="font-weight: bold;">相关材料</td>
      </tr>

      <span v-for="item in picData" :key="item.enterpriseId"><img :src="item.pictureName" width="90px" height="90px" />&nbsp;&nbsp;&nbsp;</span>
      <el-button style="width: 100px;height: 100px;" @click="dialogFormVisible=true">+</el-button>

      <tr>
        <td style="font-weight: bold;">辅料</td>
        <td>
          <el-button type="info" @click="SetUpAuxiliaryMaterials">设置</el-button>
        </td>
      </tr>

      <tr>
        <td>生产批次：{{ AuxiliaryMaterialsData.auxiliaryMaterialsProductionBatch }}</td>
      </tr>

      <tr>
        <td style="font-weight: bold;">相关材料</td>
      </tr>

      <span v-for="item in picData" :key="item.enterpriseId"><img :src="item.pictureName" width="90px" height="90px" />&nbsp;&nbsp;&nbsp;</span>
      <el-button style="width: 100px;height: 100px;" @click="dialogFormVisible=true">+</el-button>

      <tr>
        <td style="font-weight: bold;">添加剂</td>
        <td>
          <el-button type="info" @click="SetUpAdditive">设置</el-button>
        </td>
      </tr>

      <tr>
        <td>生产批次：{{ AAdditiveData.additiveProductionBatch }}</td>
      </tr>

      <tr>
        <td style="font-weight: bold;">相关材料</td>
      </tr>

      <span v-for="item in picData" :key="item.enterpriseId"><img :src="item.pictureName" width="90px" height="90px" />&nbsp;&nbsp;&nbsp;</span>
      <el-button style="width: 100px;height: 100px;" @click="dialogFormVisible=true">+</el-button>

      <tr>
        <td style="font-weight: bold;">包材</td>
        <td>
          <el-button type="info" @click="SetUpPackagingMaterials">设置</el-button>
        </td>
      </tr>

      <tr>
        <td>生产批次：{{ PackagingMaterialsData.packagingMaterialsProductionBatch }}</td>
      </tr>

      <tr>
        <td style="font-weight: bold;">相关材料</td>
      </tr>

      <span v-for="item in picData" :key="item.enterpriseId"><img :src="item.pictureName" width="90px" height="90px" />&nbsp;&nbsp;&nbsp;</span>
      <el-button style="width: 100px;height: 100px;" @click="dialogFormVisible=true">+</el-button>
    </tbody>
  </table>
</div>

  <!--企业信息-->
<div style="margin-top: 15px;">
<table style="width: 40%;">
      <thead></thead>
      <tbody>
        <tr>
          <td style="color:dodgerblue;font-size: 20px;">企业信息
            &nbsp;&nbsp;&nbsp;&nbsp;
            <el-button type="info" @click="dialogFormVisibleAddEnterprise=true">设置</el-button>
          </td>
        </tr>

        <tr>
          <td>公司名称：{{ EnterpriseData.deepProcessingCompanyName }}</td>
          <td>生产许可证号：{{ EnterpriseData.productionLicenseNumber }}</td>
        </tr>

        <tr>
          <td style="color:dodgerblue;font-size: 20px;">企业照片</td>
        </tr>
      
        <tr>
          <td>
            <span v-for="item in picData" :key="item.enterpriseId"><img :src="item.pictureName" width="90px" height="90px" />&nbsp;&nbsp;&nbsp;</span>
            <el-button style="width: 100px;height: 100px;" @click="dialogFormVisible=true">+</el-button>
          </td>
        </tr>
      </tbody>
    </table>
</div>

  <!--表单添加商品产检报告--图片-->
<div>
  <el-dialog v-model="dialogFormVisible" width="500" align-center>
    <el-upload class="avatar-uploader" action="http://localhost:5063/api/PictureManagement/UploadFile" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
    <img v-if="form.pictureNames" :src="form.pictureNames" class="avatar" />
    <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
  </el-upload>
</el-dialog>
</div>

<!--表单添加深加工信息-->
<div>
  <el-dialog v-model="dialogFormVisibleAdd" title="深加工信息" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="DeepProcessingForm" :rules="rules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="班组" prop="teamsAndGroups">
      <el-input v-model="DeepProcessingForm.teamsAndGroups" placeholder="请输入班组" />
    </el-form-item>

    <el-form-item label="负责人" prop="personInCharge">
      <el-input v-model="DeepProcessingForm.personInCharge" placeholder="请输入负责人" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitForm(ruleFormRef)">保存</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>

<!--表单修改深加工信息-->
<div>
  <el-dialog v-model="dialogFormVisibleUpdate" title="深加工信息" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="DeepProcessingForm" :rules="rules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

      <el-form-item label="班组" prop="teamsAndGroups">
      <el-input v-model="DeepProcessingForm.teamsAndGroups" placeholder="请输入班组" />
    </el-form-item>

    <el-form-item label="负责人" prop="personInCharge">
      <el-input v-model="DeepProcessingForm.personInCharge" placeholder="请输入负责人" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitFormUpdate(ruleFormRef)">修改</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>

<!--表单添加原料信息-->
<div>
  <el-dialog v-model="dialogFormVisibleRawMaterialIdAdd" title="供应商信息-原料" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="RawMaterialForm" :rules="rawMaterialFormRules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="生产批次" prop="rawMaterialProductionBatch">
      <el-input v-model="RawMaterialForm.rawMaterialProductionBatch" placeholder="请输入生产批次" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitRawMaterialForm(ruleFormRef)">保存</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>


<!--表单修改原料信息-->
<div>
  <el-dialog v-model="dialogFormVisibleRawMaterialIdUpdate" title="供应商信息-原料" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="RawMaterialForm" :rules="rawMaterialFormRules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="生产批次" prop="rawMaterialProductionBatch">
      <el-input v-model="RawMaterialForm.rawMaterialProductionBatch" placeholder="请输入生产批次" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitFormRawMaterialUpdate(ruleFormRef)">保存</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>


<!--表单添加辅料信息-->
<div>
  <el-dialog v-model="dialogFormVisibleAuxiliaryMaterialsAdd" title="供应商信息-辅料" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="AuxiliaryMaterialsForm" :rules="AuxiliaryMaterialsFormRules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="生产批次" prop="auxiliaryMaterialsProductionBatch">
      <el-input v-model="AuxiliaryMaterialsForm.auxiliaryMaterialsProductionBatch" placeholder="请输入生产批次" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitAuxiliaryMaterials(ruleFormRef)">保存</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>

<!--表单修改辅料信息-->
<div>
  <el-dialog v-model="dialogFormVisibleAuxiliaryMaterialsUpdate" title="供应商信息-辅料" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="AuxiliaryMaterialsForm" :rules="AuxiliaryMaterialsFormRules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="生产批次" prop="auxiliaryMaterialsProductionBatch">
      <el-input v-model="AuxiliaryMaterialsForm.auxiliaryMaterialsProductionBatch" placeholder="请输入生产批次" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitAuxiliaryMaterialsUpdate(ruleFormRef)">修改</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>

<!--表单添加添加剂信息-->
<div>
  <el-dialog v-model="dialogFormAdditiveAdd" title="供应商信息-添加剂" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="AdditiveForm" :rules="AdditiveFormRules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="生产批次" prop="additiveProductionBatch">
      <el-input v-model="AdditiveForm.additiveProductionBatch" placeholder="请输入生产批次" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitAdditive(ruleFormRef)">保存</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>

<!--表单修改添加剂信息-->
<div>
  <el-dialog v-model="dialogFormAdditiveUpdate" title="供应商信息-添加剂" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="AdditiveForm" :rules="AdditiveFormRules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="生产批次" prop="additiveProductionBatch">
      <el-input v-model="AdditiveForm.additiveProductionBatch" placeholder="请输入生产批次" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitAdditiveUpdate(ruleFormRef)">修改</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>

<!--表单添加包材信息-->
<div>
  <el-dialog v-model="dialogFormPackagingMaterialsAdd" title="供应商信息-包材" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="PackagingMaterialsForm" :rules="PackagingMaterialsFormRules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="生产批次" prop="packagingMaterialsProductionBatch">
      <el-input v-model="PackagingMaterialsForm.packagingMaterialsProductionBatch" placeholder="请输入生产批次" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitPackagingMaterials(ruleFormRef)">保存</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>

<!--表单修改包材信息-->
<div>
  <el-dialog v-model="dialogFormPackagingMaterialsUpdate" title="供应商信息-包材" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="PackagingMaterialsForm" :rules="PackagingMaterialsFormRules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="生产批次" prop="packagingMaterialsProductionBatch">
      <el-input v-model="PackagingMaterialsForm.packagingMaterialsProductionBatch" placeholder="请输入生产批次" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="submitPackagingMaterialsUpdate(ruleFormRef)">修改</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>



<!--表单添加企业信息-->
<div>
  <el-dialog v-model="dialogFormVisibleAddEnterprise" title="企业信息" width="500" align-center>
    <el-form ref="ruleFormRef" style="max-width: 600px" :model="enterpriseForm" :rules="enterpriseFormRules" label-width="auto" class="demo-ruleForm" :size="formSize" status-icon>

    <el-form-item label="公司名称" prop="deepProcessingCompanyName">
      <el-input v-model="enterpriseForm.deepProcessingCompanyName" placeholder="请输入公司名称" />
    </el-form-item>

    <el-form-item label="生产许可证号" prop="productionLicenseNumber">
      <el-input v-model="enterpriseForm.productionLicenseNumber" placeholder="请输入生产许可证号" />
    </el-form-item>

    <el-form-item style="float:right;">
      <el-button type="primary" @click="addEnterprise">保存</el-button>
    </el-form-item>
  </el-form>
  </el-dialog>
</div>

  <!--表单添加企业图片-->
<div>
  <el-dialog v-model="dialogFormVisible" width="500" align-center>
    <el-upload class="avatar-uploader" action="http://localhost:5063/api/PictureManagement/UploadFile" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
    <img v-if="form.pictureNames" :src="form.pictureNames" class="avatar" />
    <el-icon v-else class="avatar-uploader-icon"><Plus /></el-icon>
  </el-upload>
</el-dialog>
</div>
</template>

<script setup lang="ts">
import { reactive, ref, onMounted, computed } from 'vue'
import axios from 'axios';
import type { ComponentSize, FormInstance, FormRules } from 'element-plus'
import { ElMessage, ElMessageBox } from 'element-plus'
import { Delete, Edit, Search, Share, Upload,Plus } from '@element-plus/icons-vue'
import {useRoute,useRouter} from 'vue-router'
import type { UploadProps } from 'element-plus'

const route = useRoute();
const router = useRouter();
//表单校验
const formSize = ref<ComponentSize>('default')
const ruleFormRef = ref<FormInstance>()

onMounted(() => {
  saveUpdate()
  //深加工
  getDeepProcessingData()

  //原料
  getRawMaterialData()

  //辅料
  getAuxiliaryMaterialsData()

  //添加剂
  getAdditiveData()

  //包材
  getPackagingMaterialsData()

  //企业
  getEnterpriseList()
})

//商品Form
const form: any = reactive({
  shoppingId: route.query.shoppingId,
  shoppingNameId: '',
  productionBatch: '',
  qgPeriod: '',
  productionLicense: '',
  manufacturingEnterprise: '',
  pictureId: '',
  pictureName: '',
  pictureNames: '',
  createdBy: '',
  createdDate: '',
  deletedBy: '',
  deletedDate: '',
  updatedBy: '',
  updateDate: '',
  isDeleted: '',
  shoppingNames: '',
})

//企业信息
const enterpriseForm: any = reactive({
  shoppingId: route.query.shoppingId,
  deepProcessingCompanyName:'',
  productionLicenseNumber:'',
})

//深加工Form
const DeepProcessingForm: any = reactive({
  deepProcessingId:'',
  teamsAndGroups: '',
  personInCharge: '',
  productionBatch:'',
})

//原料
const RawMaterialForm: any = reactive({
  rawMaterialId:'',
  rawMaterialProductionBatch: '',
  shoppingId: route.query.shoppingId,
})

//辅料
const AuxiliaryMaterialsForm: any = reactive({
  auxiliaryMaterialsId:'',
  auxiliaryMaterialsProductionBatch: '',
  shoppingId: route.query.shoppingId,
})

//添加剂
const AdditiveForm: any = reactive({
  additiveId:'',
  additiveProductionBatch: '',
  shoppingId:route.query.shoppingId,
})

//包材
const PackagingMaterialsForm: any = reactive({
  packagingMaterialsId: '',
  packagingMaterialsProductionBatch: '',
  shoppingId: route.query.shoppingId,
})


//产品检验报告对话框
const dialogFormVisible = ref(false)

//企业信息添加
const dialogFormVisibleAddEnterprise = ref(false)
//深加工信息添加
const dialogFormVisibleAdd = ref(false)
//深加工信息修改
const dialogFormVisibleUpdate = ref(false)

//原料信息添加
const dialogFormVisibleRawMaterialIdAdd=ref(false)
//原料信息修改
const dialogFormVisibleRawMaterialIdUpdate = ref(false)

//辅料信息添加
const dialogFormVisibleAuxiliaryMaterialsAdd=ref(false)
//辅料信息修改
const dialogFormVisibleAuxiliaryMaterialsUpdate = ref(false)

//添加剂信息添加
const dialogFormAdditiveAdd=ref(false)
//添加剂信息修改
const dialogFormAdditiveUpdate = ref(false)

//添加包材添加
const dialogFormPackagingMaterialsAdd=ref(false)
//添加包材修改
const dialogFormPackagingMaterialsUpdate = ref(false)

//图片上传
const handleAvatarSuccess = (picUrl: any) => {
  console.log(picUrl);
  
  form.pictureName = picUrl.data;
} 
//上传前判断(文件类型、文件大小)
const beforeAvatarUpload: UploadProps['beforeUpload'] = (rawFile) => {
  if (rawFile.type !== 'image/jpeg' && rawFile.type !== 'image/gif' && rawFile.type !== 'image/png') {
    ElMessage.error('文件格式必须是[JPG,GIF,PNG]格式!')
    return false
  } else if (rawFile.size / 1024 / 1024 > 2) {
    ElMessage.error('文件大小不能超过2MB!')
    return false
  }
  return true
}

//-----------------------校验
//深加工信息校验
const rules = reactive<FormRules>({
  teamsAndGroups: [
    { required: true, message: '请输入班组', trigger: 'change',},
  ],
  personInCharge: [
    { required: true, message: '请输入负责人', trigger: 'blur' },
  ],
})


//原料信息校验
const rawMaterialFormRules=reactive<FormRules>({
  rawMaterialProductionBatch: [
    { required: true, message: '请输入生产批次', trigger: 'change',},
  ],
})


//辅料信息校验
const AuxiliaryMaterialsFormRules=reactive<FormRules>({
  auxiliaryMaterialsProductionBatch: [
    { required: true, message: '请输入生产批次', trigger: 'change',},
  ],
})

//添加剂信息校验
const AdditiveFormRules=reactive<FormRules>({
  additiveProductionBatch: [
    { required: true, message: '请输入生产批次', trigger: 'change',},
  ],
})

//包材信息校验
const PackagingMaterialsFormRules=reactive<FormRules>({
  packagingMaterialsProductionBatch: [
    { required: true, message: '请输入生产批次', trigger: 'change',},
  ],
})


//企业信息校验
const enterpriseFormRules=reactive<FormRules>({
  deepProcessingCompanyName: [
    { required: true, message: '请输入公司名称', trigger: 'change',},
  ],
  productionLicenseNumber: [
    { required: true, message: '请输入生产许可证号', trigger: 'blur' },
  ],
})

//----------------------商品
//反填商品信息
const saveUpdate = () => {
  let Backshopping = {
    shoppingId:form.shoppingId
  }
  axios.post('api/ShoppingManagement/BackInfoShopping',Backshopping).then(res => {
    //console.log(res);
    let back = res.data.data;
    form.shoppingId = back.shoppingId;
    form.shoppingNameId = back.shoppingNameId;
    form.shoppingNames = back.shoppingNames;
    form.productionBatch=back.productionBatch;
    form.qgPeriod=back.qgPeriod;
    form.productionLicense=back.productionLicense;
    form.manufacturingEnterprise = back.manufacturingEnterprise;
    form.pictureId = back.pictureId;
    form.pictureName = back.pictureName;   
    form.createdBy = back.createdBy;
    form.createdDate = back.createdDate;
    form.deletedBy = back.deletedBy;
    form.deletedDate = back.deletedDate;
    form.updatedBy = localStorage.userName;
    form.updateDate=Date.now;
    form.isDeleted=back.isDeleted
  }).catch(err => {
    console.log(err);

  })
}

//-------------------深加工

//深加工信息设置
const SetUp = () => {
  if (DeepProcessingForm.deepProcessingId == "") {
    //打开深加工添加对话框
    dialogFormVisibleAdd.value=true
    //添加深加工信息
  } else {
    //打开深加工修改对话框
    dialogFormVisibleUpdate.value = true
    //反填信息
    BackDeepProcessingData()
    //修改深加工信息
  }
}

//添加深加工信息
const submitForm = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let deepProcessing = {
        teamsAndGroups: DeepProcessingForm.teamsAndGroups,
        personInCharge: DeepProcessingForm.personInCharge,
        productionBatch:form.productionBatch,
        shoppingId:route.query.shoppingId,
        createdBy: localStorage.userName,
      }
      axios.post('/api/DeepProcessingManagement/AddDeepProcessingInfo',deepProcessing).then(res => {
        console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("保存成功!")
          //关闭对话框
          dialogFormVisibleAdd.value = false;
        } 
        if (res.data.code == -1) {
          ElMessage.error("保存失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//显示深加工信息
const DeepProcessingData: any = ref([])
const DeepProcessingPicture: any = ref([])
const getDeepProcessingData = () => {
  let deepProcessing = {
    shoppingId:route.query.shoppingId
  }
  axios.post('/api/DeepProcessingManagement/ShowDeepProcessingList',deepProcessing).then(res=>{
    //console.log(res);
    DeepProcessingData.value = res.data.data[0];
    DeepProcessingForm.deepProcessingId = res.data.data[0].deepProcessingId;
    DeepProcessingPicture.value = res.data.data;
  }).catch(err=>{
    console.log(err);
    
  })    
}

//反填深加工信息
const BackDeepProcessingData = () => {
  let deepProcessing = {
    deepProcessingId:DeepProcessingForm.deepProcessingId
  }
  axios.post('/api/DeepProcessingManagement/BackInfoDeepProcessing',deepProcessing).then(res=>{
    //console.log(res);
    let DeepProcessingData = res.data.data;
    DeepProcessingForm.teamsAndGroups = DeepProcessingData.teamsAndGroups;
    DeepProcessingForm.personInCharge = DeepProcessingData.personInCharge;
    DeepProcessingForm.productionBatch = DeepProcessingData.productionBatch;
  }).catch(err=>{
    console.log(err);
    
  })    
}

//修改深加工信息
const submitFormUpdate = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let UpdateDeepProcessing = {
        deepProcessingId:DeepProcessingForm.deepProcessingId,
        teamsAndGroups:DeepProcessingForm.teamsAndGroups,
        personInCharge: DeepProcessingForm.personInCharge,
        updateBy: localStorage.userName,
      }
      axios.post('/api/DeepProcessingManagement/UpdateDeepProcessing',UpdateDeepProcessing).then(res => {
        //console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("修改成功!")
          //关闭对话框
          dialogFormVisibleUpdate.value = false
          //刷新深加工信息页面
          getDeepProcessingData()
        } 
        if (res.data.code == -1) {
          ElMessage.error("修改失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//-----------------原料

//原料信息设置
const SetUpRawMaterial = () => {
  if (RawMaterialForm.rawMaterialId == "") {
    //打开原料添加对话框
    dialogFormVisibleRawMaterialIdAdd.value=true
    //添加原料信息
  } else {
    //打开原料修改对话框
    dialogFormVisibleRawMaterialIdUpdate.value = true
    //反填信息
    BackRawMaterialData()
    //修改原料信息
  }
}

//添加原料信息
const submitRawMaterialForm = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let rawMaterial = {
        rawMaterialProductionBatch:RawMaterialForm.rawMaterialProductionBatch,
        shoppingId:route.query.shoppingId,
        createdBy: localStorage.userName,
      }
      axios.post('/api/RawMaterialManagement/AddRawMaterialInfo',rawMaterial).then(res => {
        console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("保存成功!")
          //关闭对话框
          dialogFormVisibleRawMaterialIdAdd.value = false;
        } 
        if (res.data.code == -1) {
          ElMessage.error("保存失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//显示原料信息
const RawMaterialData: any = ref([])
const RawMaterialPicture: any = ref([])
const getRawMaterialData = () => {
  let RawMaterial = {
    shoppingId:route.query.shoppingId
  }
  axios.post('/api/RawMaterialManagement/ShowRawMaterialList',RawMaterial).then(res=>{
    //console.log(res);
    RawMaterialData.value = res.data.data[0];
    RawMaterialForm.rawMaterialId = res.data.data[0].rawMaterialId;
    
    RawMaterialPicture.value = res.data.data;
  }).catch(err=>{
    console.log(err);
    
  })    
}

//反填原料信息
const BackRawMaterialData = () => {
  let RawMaterialInfo = {
    rawMaterialId:RawMaterialForm.rawMaterialId
  }
  
  axios.post('/api/RawMaterialManagement/BackInfoRawMaterial',RawMaterialInfo).then(res=>{
    //console.log(res);
    let BackInfoRawMaterialData = res.data.data;
    RawMaterialForm.rawMaterialProductionBatch = BackInfoRawMaterialData.rawMaterialProductionBatch;
  }).catch(err=>{
    console.log(err);
    
  })    
}

//修改原料信息
const submitFormRawMaterialUpdate = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let RawMaterial = {
        rawMaterialId:RawMaterialForm.rawMaterialId,
        rawMaterialProductionBatch:RawMaterialForm.rawMaterialProductionBatch,
        updatedBy: localStorage.userName,
      }
      axios.post('/api/RawMaterialManagement/UpdateRawMaterial',RawMaterial).then(res => {
        //console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("修改成功!")
          //关闭对话框
          dialogFormVisibleRawMaterialIdUpdate.value = false
          //刷新原料信息页面
          getRawMaterialData()
        } 
        if (res.data.code == -1) {
          ElMessage.error("修改失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//--------------------辅料
//辅料信息设置
const SetUpAuxiliaryMaterials = () => {
  if (AuxiliaryMaterialsForm.auxiliaryMaterialsId == "") {
    //打开辅料添加对话框
    dialogFormVisibleAuxiliaryMaterialsAdd.value=true
    //添加辅料信息
  } else {
    //打开辅料修改对话框
    dialogFormVisibleAuxiliaryMaterialsUpdate.value = true
    //反填信息
    BackAuxiliaryMaterialsData()
    //修改辅料信息
  }
}

//添加辅料信息
const submitAuxiliaryMaterials = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let auxiliaryMaterials = {
        auxiliaryMaterialsProductionBatch:AuxiliaryMaterialsForm.auxiliaryMaterialsProductionBatch,
        shoppingId:route.query.shoppingId,
        createdBy: localStorage.userName,
      }
      axios.post('/api/AuxiliaryMaterialsManagement/AddAuxiliaryMaterialsInfo',auxiliaryMaterials).then(res => {
        console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("保存成功!")
          //关闭对话框
          dialogFormVisibleAuxiliaryMaterialsAdd.value = false;
        } 
        if (res.data.code == -1) {
          ElMessage.error("保存失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//显示辅料信息
const AuxiliaryMaterialsData: any = ref([])
const AuxiliaryMaterialsPicture: any = ref([])
const getAuxiliaryMaterialsData = () => {
  let AuxiliaryMaterials = {
    shoppingId: route.query.shoppingId
  }
  axios.post('/api/AuxiliaryMaterialsManagement/ShowAuxiliaryMaterialsList', AuxiliaryMaterials).then(res => {
    //console.log(res);
    if (res.data.data.length >= 0) {
      AuxiliaryMaterialsData.value = res.data.data[0];
      AuxiliaryMaterialsForm.auxiliaryMaterialsId = res.data.data[0].auxiliaryMaterialsId;

      AuxiliaryMaterialsPicture.value = res.data.data;
    }

  }).catch(err => {
    console.log(err);

  })
}

//反填原料信息
const BackAuxiliaryMaterialsData = () => {
  let AuxiliaryMaterialsInfo = {
    auxiliaryMaterialsId:AuxiliaryMaterialsForm.auxiliaryMaterialsId
  }
  
  axios.post('/api/AuxiliaryMaterialsManagement/BackInfoAuxiliaryMaterials',AuxiliaryMaterialsInfo).then(res=>{
    //console.log(res);
    let AuxiliaryMaterialsData = res.data.data;
    AuxiliaryMaterialsForm.auxiliaryMaterialsProductionBatch = AuxiliaryMaterialsData.auxiliaryMaterialsProductionBatch;
  }).catch(err=>{
    console.log(err);
    
  })    
}

//修改原料信息
const submitAuxiliaryMaterialsUpdate = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let AuxiliaryMaterials = {
        auxiliaryMaterialsId:AuxiliaryMaterialsForm.auxiliaryMaterialsId,
        auxiliaryMaterialsProductionBatch:AuxiliaryMaterialsForm.auxiliaryMaterialsProductionBatch,
        updatedBy: localStorage.userName,
      }
      axios.post('/api/AuxiliaryMaterialsManagement/UpdateAuxiliaryMaterials',AuxiliaryMaterials).then(res => {
        //console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("修改成功!")
          //关闭对话框
          dialogFormVisibleAuxiliaryMaterialsUpdate.value = false
          //刷新辅料信息页面
          getAuxiliaryMaterialsData()
        } 
        if (res.data.code == -1) {
          ElMessage.error("修改失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//---------------添加剂
//添加剂信息设置
const SetUpAdditive = () => {
  if (AdditiveForm.additiveId == "") {
    //打开添加剂添加对话框
    dialogFormAdditiveAdd.value=true
    //添加添加剂信息
  } else {
    //打开添加剂修改对话框
    dialogFormAdditiveUpdate.value = true
    //反填信息
    BackAdditiveData()
    //修改添加剂信息
  }
}

//添加添加剂信息
const submitAdditive = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let Additive = {
        additiveProductionBatch:AdditiveForm.additiveProductionBatch,
        shoppingId:route.query.shoppingId,
        createdBy: localStorage.userName,
      }
      axios.post('/api/AdditiveManagement/AddAdditiveInfo',Additive).then(res => {
        console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("保存成功!")
          //关闭对话框
          dialogFormAdditiveAdd.value = false;
        } 
        if (res.data.code == -1) {
          ElMessage.error("保存失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//显示添加剂信息
const AAdditiveData: any = ref([])
const AAdditivePicture: any = ref([])
const getAdditiveData = () => {
  let Additive = {
    shoppingId: route.query.shoppingId
  }
  axios.post('/api/AdditiveManagement/ShowAdditiveList', Additive).then(res => {
    //console.log(res);
    AAdditiveData.value = res.data.data[0];
    AdditiveForm.additiveId = res.data.data[0].additiveId;
    AAdditivePicture.value = res.data.data;
  }).catch(err => {
    console.log(err);

  })
}

//反填添加剂信息
const BackAdditiveData = () => {
  let AdditiveInfo = {
    additiveId:AdditiveForm.additiveId
  }
  
  axios.post('/api/AdditiveManagement/BackInfoAdditive',AdditiveInfo).then(res=>{
    console.log(res);
    let AdditiveData = res.data.data;
    AdditiveForm.additiveProductionBatch = AdditiveData.additiveProductionBatch;
  }).catch(err=>{
    console.log(err);
    
  })    
}

//修改添加剂信息
const submitAdditiveUpdate = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let AuxiliaryMaterials = {
        additiveId:AdditiveForm.additiveId,
        additiveProductionBatch:AdditiveForm.additiveProductionBatch,
        updatedBy: localStorage.userName,
      }
      axios.post('/api/AdditiveManagement/UpdateAdditive',AuxiliaryMaterials).then(res => {
        console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("修改成功!")
          //关闭对话框
          dialogFormVisibleAuxiliaryMaterialsUpdate.value = false
          //刷新添加剂信息页面
          getAdditiveData()
        } 
        if (res.data.code == -1) {
          ElMessage.error("修改失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//------------------包材
//包材信息设置
const SetUpPackagingMaterials = () => {
  if (PackagingMaterialsForm.packagingMaterialsId == "") {
    //打开包材添加对话框
    dialogFormPackagingMaterialsAdd.value=true
    //添加包材信息
  } else {
    //打开包材修改对话框
    dialogFormPackagingMaterialsUpdate.value = true
    //反填信息
    BackPackagingMaterialsData()
    //修改包材信息
  }
}

//添加包材信息
const submitPackagingMaterials = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let PackagingMaterials = {
        packagingMaterialsProductionBatch:PackagingMaterialsForm.packagingMaterialsProductionBatch,
        shoppingId:route.query.shoppingId,
        createdBy: localStorage.userName,
      }
      axios.post('/api/PackagingMaterialsManagement/AddPackagingMaterialsInfo',PackagingMaterials).then(res => {
        console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("保存成功!")
          //关闭对话框
          dialogFormPackagingMaterialsAdd.value = false;
        } 
        if (res.data.code == -1) {
          ElMessage.error("保存失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//显示包材信息
const PackagingMaterialsData: any = ref([])
const PackagingMaterialsPicture: any = ref([])
const getPackagingMaterialsData = () => {
  let PackagingMaterials = {
    shoppingId: route.query.shoppingId
  }
  axios.post('/api/PackagingMaterialsManagement/ShowPackagingMaterialsList', PackagingMaterials).then(res => {
    console.log(res);
    PackagingMaterialsData.value = res.data.data[0];
    PackagingMaterialsForm.packagingMaterialsId = res.data.data[0].packagingMaterialsId;
    PackagingMaterialsPicture.value = res.data.data;
  }).catch(err => {
    console.log(err);

  })
}

//反填包材信息
const BackPackagingMaterialsData = () => {
  let PackagingMaterialsInfo = {
    packagingMaterialsId:PackagingMaterialsForm.packagingMaterialsId
  }
  
  axios.post('/api/PackagingMaterialsManagement/BackInfoPackagingMaterials',PackagingMaterialsInfo).then(res=>{
    console.log(res);
    let PackagingMaterialsData = res.data.data;
    PackagingMaterialsForm.packagingMaterialsProductionBatch = PackagingMaterialsData.packagingMaterialsProductionBatch;
  }).catch(err=>{
    console.log(err);
    
  })    
}

//修改包材信息
const submitPackagingMaterialsUpdate = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate((valid, fields) => {
    if (valid) {
      let PackagingMaterials = {
        packagingMaterialsId:PackagingMaterialsForm.packagingMaterialsId,
        packagingMaterialsProductionBatch:PackagingMaterialsForm.packagingMaterialsProductionBatch,
        updatedBy: localStorage.userName,
      }
      axios.post('/api/PackagingMaterialsManagement/UpdatePackagingMaterials',PackagingMaterials).then(res => {
        console.log(res);
        if (res.data.code == 1) {
          ElMessage.success("修改成功!")
          //关闭对话框
          dialogFormPackagingMaterialsUpdate.value = false
          //刷包材信息页面
          getPackagingMaterialsData()
        } 
        if (res.data.code == -1) {
          ElMessage.error("修改失败!")
          return
        }
      }).catch(err => {
        console.log(err);
        
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

//企业
//添加企业信息
const addEnterprise = () => {
  //打开对话框
  dialogFormVisibleAddEnterprise.value = true;
  let enterprise = {
    shoppingId:route.query.shoppingId,
    deepProcessingCompanyName: enterpriseForm.deepProcessingCompanyName,
    productionLicenseNumber: enterpriseForm.productionLicenseNumber,
    updatedBy:localStorage.userName,
  }
  axios.post('/api/EnterpriseManagement/AddDeepProcessingEnterpriseInfo', enterprise).then(res => {
    console.log(res);
    if (res.data.code == 1) {
      ElMessage.success("保存成功!")
      //关闭对话框
      dialogFormVisibleAddEnterprise.value = false;
      //刷新企业信息页面
      getEnterpriseList()
    }
    if (res.data.code == -1) {
      ElMessage.error("保存失败!")
      return
    }
  }).catch(err => {
    console.log(err);

  })
}

//查询企业信息
const EnterpriseData: any = ref([])
//图片
const picData:any=ref([])
const getEnterpriseList = () => {
  axios.post('/api/EnterpriseManagement/SearchEnterprise',{}).then(res => {
    console.log(res);
    EnterpriseData.value = res.data.data[0];
    picData.value=res.data.data
  }).catch(err => {
    console.log(err);

  })
}

</script>

<style scoped>

.avatar-uploader .avatar {
  width: 178px;
  height: 178px;
  display: block;
}
.avatar-uploader .el-upload {
  border: 1px dashed var(--el-border-color);
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: var(--el-transition-duration-fast);
}

.avatar-uploader .el-upload:hover {
  border-color: var(--el-color-primary);
}

.el-icon.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  text-align: center;
}

</style>